import QtQuick 2.8
import QtQuick.Controls 2.1
import QtQuick.Layouts 1.2

Page {
    id: pageSetting
    title: qsTr("设置")
    visible: true

    property StackView stack: null
 
    Keys.enabled: true
    focus: true
    Keys.onPressed: {
        if(event.key == Qt.Key_Escape) {
            stack.pop()
            return;
        }
        event.accepted = true
    }
    header: ToolBar {
        background: Rectangle {
            implicitWidth: 100
            implicitHeight: 40
            opacity: 1
            color: "#3f51b5"
        }
        RowLayout {
            anchors.fill: parent
            ToolButton {
                text: qsTr("‹返回[电源键]")
                onClicked: stack.pop()
            }
            Label {
                text: "设置"
                font.pointSize: 16
                color: '#ffffff'
                elide: Label.ElideRight
                horizontalAlignment: Qt.AlignHCenter
                verticalAlignment: Qt.AlignVCenter
                Layout.fillWidth: true
            }
            ToolButton {
                text: qsTr("⋮")
                onClicked: menu.open()
            }
        }
    }
    Rectangle{
        anchors.fill: parent
        color: '#2c489c'
        Rectangle {
            anchors.fill: parent
            anchors.margins: 10
            color: '#2c489c'
            Column{
                anchors.fill: parent

                Rectangle{
                    width: parent.width
                    height: 50
                    color: '#2c489c'
                    border.color: "white"
                    border.width:1
                    radius: 5
                    gradient: Gradient {
                        GradientStop { position: 0.0; color: "lightsteelblue" }
                        GradientStop { position: 1.0; color: "#2c489c" }
                    }
                    Text{
                        anchors.fill: parent
                        // horizontalAlignment: Text.AlignHCenter//(1)
                        verticalAlignment: Text.AlignVCenter    //垂直居中，控件必须有height才可以使用
                        horizontalAlignment: Text.AlignLeft
                        font.pointSize: 20
                        font.bold: true
                        color: 'white'
                        text:'扫码连接网络[1]'
                    }
                }

                Rectangle{
                    width: parent.width
                    height: 16
                    color: 'transparent'
                }

                Rectangle{
                    width: parent.width
                    height: 50
                    anchors.topMargin: 20
                    color: '#2c489c'
                    border.color: "white"
                    border.width:1
                    radius: 5
                    gradient: Gradient {
                        GradientStop { position: 0.0; color: "lightsteelblue" }
                        GradientStop { position: 1.0; color: "#2c489c" }
                    }
                    Text{
                        anchors.fill: parent
                        // horizontalAlignment: Text.AlignHCenter//(1)
                        verticalAlignment: Text.AlignVCenter    //垂直居中，控件必须有height才可以使用
                        horizontalAlignment: Text.AlignLeft
                        font.pointSize: 20
                        font.bold: true
                        color: 'white'
                        text:'系统版本【2.0】'
                    }
                }
            }
        }
        // ListView {
        //     anchors.fill: parent
        //     focus: true

        //     Rectangle {
        //         width: parent.width
        //         height: 100
        //         color: "lightsteelblue"
        //         radius: 5
        //         Text {
        //             text: '扫码连接网络[2]'
        //             font.pointSize: 20
        //             color: "white"
        //         }
        //     }
        //     Rectangle {
        //         width: parent.width
        //         height: 100
        //         color: "lightsteelblue"
        //         radius: 5
        //         Text {
        //             text: '其他设置[2]'
        //             font.pointSize: 20
        //             color: "black"
        //         }
        //     }
        // }
    }
}